// 公共样式
.flexCenter{
  display: flex;
  align-items: center;
}
.flexBetween{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
  
  
  
$themes: (
  // 默认颜色
  default: (
    // 字体颜色(t+颜色值),
    "t333": #333,
    "tFF5274": #FF5274,

    // 背景颜色(bg+颜色值),
    "bgFF5274": #FF5274,
    "bg20222A": #20222A,
    "bgEFF2F7": #EFF2F7,
    "bgFFFFFF": #FFFFFF,

    // 线条颜色(bor+颜色值),
    "bor666": #666,
    "borFF5274": #FF5274,
  )
);

$allThemes:(
  default:(
    'tThemes':#FF5274,
    'bgThemes':#FF5274,
    'borThemes':#FF5274,
    'bgHead':#FF5274,
    'borHead':#FF5274
  ),
  F34343:(
    'tThemes':#F34343,
    'bgThemes':#F34343,
    'borThemes':#F34343,
    'bgHead':#E63535,
    'borHead':#E63535
  )
);

// 字体颜色sColor(t, t333),背景颜色sColor(bg, bg333), 线条颜色sColor(bor, bor333);
@mixin sColor($name, $value) {
  @each $t1, $t2 in $themes {
    @at-root #app.them_#{$t1} & {
      @content;
      @if $name == bor {
        border-color: map-get($map: $t2, $key: $value);
      } @else if $name == t {
        color: map-get($map: $t2, $key: $value);
      } @else if $name == bg {
        background-color: map-get($map: $t2, $key: $value);
      }
    }
  }
}

@mixin themify($name, $value) {
  @each $t1, $t2 in $allThemes {
    @at-root #app.theme_#{$t1} & {
      @content;
      @if $name == bor {
        border-color: map-get($map: $t2, $key: $value);
      } @else if $name == t {
        color: map-get($map: $t2, $key: $value);
      } @else if $name == bg {
        background-color: map-get($map: $t2, $key: $value);
      }
    }
  }
}

//例如: color: setColor('t466CFF');
$aColor: (
  // 字体颜色
  'tFFF': #FFF,
  'tFB901C': #FB901C,
  't466CFF': #466CFF,
  't111734': #111734,
  't858A9D': #858A9D,
  'tFF4646': #FF4646,
  // 背景颜色
  'bgFFF': #FFF,
  'bg466BFF': #466BFF,
  'bg858A9D': #858A9D,
  'bgEDF1F5': #EDF1F5,
  // 线条颜色
  'borEDF2F6': #EDF2F6,
  'bor858A9D': #858A9D,
);

@function setColor($v) {
  @return map-get($map: $aColor, $key: $v);
}